<template>
    <el-dialog :title="type == 'add' ? '添加文件' : '修改文件'" v-model="visible" width="600px">
        <el-form label-width="100px">



      <el-form-item label="名称：" >
        <el-input type="text" v-model="title"></el-input>
      </el-form-item>
          <el-form-item label="代码路径：" >
            <el-input type="text" v-model="genPath" placeholder=" 代码路径：相对于根目录"></el-input>
             </el-form-item>
            
            <el-input type="textarea" :rows="15" placeholder="请输入内容" v-model="textarea"></el-input>

        </el-form>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="visible = false">取 消</el-button>

                <el-button type="primary" @click="submitForm">确 定</el-button>
            </span>
        </template>
    </el-dialog>
</template>

<script lang="ts">
    import * as db_context from '@/models/db_context'
    import {
        reactive,
        ref,
        toRefs
    } from 'vue'

    import {
        ElMessage
    } from 'element-plus'

    export default {
        name: 'DialogTemplateFiles',
        props: {
            type: String, // 用于判断是添加还是编辑
            reload: Function // 添加或修改完后，刷新列表页
        },
        setup(props: any) {
            const formRef = ref < any > (null)
            const state = reactive({
                visible: false,
                title: '',
                textarea: '',
                id: '',
                tid:'',
                genPath:''
            })
            // 获取详情
            const getDetail = async (id: string) => {
                console.log(id);
                
                const result: any = await db_context.TemplateFile.getById(Number.parseInt(id));
                console.log(result);
                state.title= result.id;
                state.textarea = result.fileContent;
                state.title = result.fileName;
                state.genPath=result.genPath;
                state.id = result.id;
            }

            // 开启弹窗
            const open = (id: string,tid:string) => {
                state.tid=tid;
                state.visible = true
                if (id) {
                    state.id = id
                    getDetail(id)
                } else {
                   
                    state.id = "";
                    state.title = "";
                    state.textarea="";
                    state.genPath="";
                }
            }

            // 关闭弹窗
            const close = () => {
                state.visible = false
            }
            const submitForm = async () => {
                if (state.title == "") {
                    ElMessage.error('名称不能为空');
                    return;
                }
                if (state.id == "") {
                    const item: any = {
                        fileName: state.title,
                        fileContent: state.textarea,
                        templateId: state.tid,
                        genPath:state.genPath
                    };

                    await db_context.TemplateFile.createItem(item);
                    props.reload();
                    ElMessage.success('添加成功');
                    state.visible = false

                } else {
                    const item: any = {
                       fileName: state.title,
                        fileContent: state.textarea,
                        templateId: state.tid,
                        genPath:state.genPath
                    };
                    await db_context.TemplateFile.updateItemById(item, Number.parseInt(state.id));
                    props.reload();
                    ElMessage.success('修改成功');
                    state.visible = false
                }

            }
            return {
                ...toRefs(state),
                open,
                close,
                formRef,
                
                submitForm
            }
        }
    }
</script>